<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title>山河旅行社</title>
    <link rel="stylesheet" href="css/styles.css">
</head>
<body>
<header id="header">
    <jsp:include page="head.jsp"/>
</header>


<div id="headline">
    <img src="img/headline.jpg" alt="">
    <hgroup>
        <h2>机票订购</h2>
        <h3>机票、火车票、轮船票等各种票务订购的服务</h3>
    </hgroup>
</div>

<div id="container">
    <aside class="sidebar">
        <jsp:include page="right.jsp"/>
    </aside>
    <div class="list ticket">
        <form action="getAirTicket.html" id="searchForm" method="post">
            <h2>机票预订</h2>
            <div class="type">
                <p>航班类型</p>
            </div>
            <div class="form left">
                <input type="hidden" id="pageNum" name="pn"/>
                <p>
                    <label for="from_city">出发城市</label>
                    <input type="text" name="origin" value="${airTicket.origin}" id="from_city" placeholder="城市名">
                </p>
                <p>
                    <label for="to_city">到达城市</label>
                    <input type="text" name="destination" value="${airTicket.destination}" id="to_city" placeholder="城市名">
                </p>
            </div>
            <div class="form right">
                <p>
                    <label for="from_date">时间</label>
                    <input type="date" name="departDate" value="${airTicket.departDate}" id="from_date" placeholder="时间/日期">
                </p>

            </div>
            <div class="form button">
                <p>
                    <button type="submit" class="submit">查询</button>
                </p>
            </div>
        </form>
        <div class="new">
            <table>
                <thead>
                <tr>
                    <th>路线</th>
                    <th>日期</th>
                    <th>价格</th>
                    <th>航班</th>
                    <th>预订</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${pageInfo.result}" var="air">
                <tr>
                    <td>${air.origin}-${air.destination}</td>
                    <td>

                        <fmt:formatDate value="${air.departDate}" type="date" pattern="HH:mm"/>
                        </td>
                    <td class="price">￥${air.price}</td>
                    <td>${air.flight}</td>
                    <td><a href=" addTicket.html?id=${air.id}" class="reserve">预订</a></td>
                </tr>
                </c:forEach>

                </tbody>
                <tfoot>
                <tr>
                    <td colspan="7"><a href="#" onclick="page(${empty param.pn?1:param.pn-1})">上一页</a>
                        <a href="#" onclick="page(${empty param.pn?2:param.pn+1})">下一页</a></td>
                </tr>
                </tfoot>
            </table>
        </div>
    </div>
</div>

<footer id="footer">
    <jsp:include page="below.jsp"/>
</footer>

</body>

<script type="text/javascript">
//    $(function(){
//        $("tr:odd").css("background-color","yellow")
//    })
    function page(pn) {
        if (pn == null || isNaN(pn)) {
            pn = 1
        }
        if (pn < 1) {
            pn == 1;
        }
        if (pn > "${pageInfo.totalPage}") {
            pn = "${pageInfo.totalPage}";
        }
        $("#pageNum").val(pn);
        $("#searchForm").submit();
    }
</script>
</html>
